import React from 'react';
import useGameStore from '../context/gameStore';

const GameStarter = () => {
  const gameStatus = useGameStore(state => state.gameStatus);
  const prepareGame = useGameStore(state => state.prepareGame);
  const startGame = useGameStore(state => state.startGame);
  const pauseGame = useGameStore(state => state.pauseGame);
  const resumeGame = useGameStore(state => state.resumeGame);
  const resetGame = useGameStore(state => state.resetGame);
  
  const handleClick = async () => {
    switch (gameStatus) {
      case 'idle':
        await prepareGame();
        break;
      case 'ready':
        startGame();
        break;
      case 'playing':
        pauseGame();
        break;
      case 'paused':
        resumeGame();
        break;
      case 'finished':
        resetGame();
        break;
      default:
        break;
    }
  };
  
  const getButtonText = () => {
    switch (gameStatus) {
      case 'idle':
        return '点击开始';
      case 'loading':
        return '加载中...';
      case 'ready':
        return '开始游戏';
      case 'playing':
        return '暂停';
      case 'paused':
        return '继续';
      case 'finished':
        return '重新开始';
      case 'error':
        return '加载失败';
      default:
        return '开始游戏';
    }
  };
  
  return (
    <button
      className={`game-starter ${gameStatus}`}
      onClick={handleClick}
      disabled={gameStatus === 'loading' || gameStatus === 'error'}
    >
      {getButtonText()}
    </button>
  );
};

export default GameStarter; 